<template>
    <view class="page-my-settings">
        <view style="height: 1upx;"></view>
        <view class="settings-content">
            <block v-for="(menuItem, index) in menuItems" :key="index">
                <category-item :param="menuItem" :key="index" >

                </category-item>
            </block>
        </view>
        <confirm-dialog v-if="showConfirmDialog" title="确定关闭吗？" message="关闭后将不会收到新报价的通知，确定关闭吗？" @confirm="confirm" @cancel="cancel">

        </confirm-dialog>
    </view>
</template>
<script>
    import categoryItem from '@/components/ibs/categoryItem.vue';
    import confirmDialog from '@/components/dialog/confirmDialog.vue';
    import api from '@/common/api.js';
    import enums from '@/common/sysEnum.js';
    export default {
        components: {
            categoryItem,
            confirmDialog
        },
        data() {
            return {
                menuItems: [
                    {
                        itemClass: ['category-item', 'margin-item'],
                        label: '新报价通知', // 标签显示的文字
                        showSwitch: true,
                        switchChecked: false,
                        change: this.quoteNotice
                    }
                ],
                userInfo: {}, // 用户信息
                showConfirmDialog: false // 是否显示确认对话框
            };
        },
        onLoad() {
            Object.assign(this.userInfo, this.$store.getters.getUserInfo);
            console.log('settings: ' + JSON.stringify(this.userInfo));
            if (this.userInfo && this.userInfo.allowQuoteNotice) {
                this.menuItems[0].switchChecked = true;
            } else {
                this.menuItems[0].switchChecked = false;
            }
        },
        methods: {
            /**
             * 保存用户的设置信息
             */
            saveSettings() {
                var data={
                    contactName: this.userInfo.contactName,
                    contactMobileNo: this.userInfo.contactMobileNo,
                    companyName: this.userInfo.companyName,
                    id: this.userInfo.userId,
                    allowQuoteNotice: this.allowQuoteNotice
                };
                let that = this;
                api.httpRequest('/wechat/user/saveUser',data,enums.enums.REQUEST_METHOD.POST).then(res => {
                    if (res.code === 200) {
                        that.userInfo.allowQuoteNotice = that.allowQuoteNotice;
                        that.menuItems[0].switchChecked = that.allowQuoteNotice;
                        that.showConfirmDialog = false;
                        that.$store.dispatch('update_user_info', this.userInfo);
                        that.showToast("保存成功", 3000);
                    } else {
                        // 显示错误提示语
                        that.showToast(res.message);
                    }
                });
            },
            /**
             * 新报价通知切换时保存设置
             * @param e
             */
            quoteNotice(e) {
                this.allowQuoteNotice = e.detail.value;
                if (!e.detail.value) {
                    this.showConfirmDialog = true;
                } else {
                    this.saveSettings();
                }
            },
            /**
             * 确认关闭新报价通知
             **/
            confirm() {
                this.saveSettings();
            },
            // 关闭dialog
            cancel() {
                this.showConfirmDialog = false;
            }
        }
    }
</script>
<style>
    .page-my-settings {
        width: 100%;
        height: 100%;
        background-color: #f2f2f5;
    }
    .page-my-settings .settings-content {
        width: 100%;
        height: 100%;
        margin-top: 20upx;
        margin-right: 24upx;
        background-color: #ffffff;
        border-top: 1upx #e5e5e5 solid;
    }
    .page-my-settings .category-item {
        display: flex;
        height: 100upx;
        line-height: 100upx;
        vertical-align: middle;
        padding-left: 4upx;
        padding-right: 24upx;
        font-size: 28upx;
        color: #1a1a1a;
        background-color: #ffffff;
        border-bottom: 1px #e5e5e5 solid;
        align-items: center;
        justify-content: space-between;

    }
    .page-my .margin-item {
        margin-top: 20upx;
        border-top: 1px #e5e5e5 solid;
    }
</style>